@charset "utf-8";
@import "reset.scss";
@import "common.scss";

.wrap{
    header{

        .youjian{

            width: .9333rem;
            height: .9333rem;
            margin-bottom: -0.1333rem;

            i{
                color: #ff9344;
                font-size: .9333rem;
              
            }

        }

      
    }

    main{

        margin-bottom: 1.8rem;
        .touxianglan{
            width: 9.4667rem;
            height: 2.2667rem;
            margin: .2rem auto;
            display: flex;
            position: relative;

            .tx{
                width: 2.2667rem;
                height: 2.2667rem;
                border-radius: 50%;

                img{
                    width: 100%;
                }
            }

            .text{

                width: 6rem;
                margin-left: .2rem;
                margin-top: .4rem;
               
 

                p{
                    &:first-of-type{
                        font-size: .4rem;
                        line-height: .4667rem;
                        font-weight: bold;
                        margin-bottom: .4rem;
                    }

                    &:last-of-type{
                        font-size: .3467rem;
                        line-height: .7067rem;
                        color: #9d9d9d;
                    }
                }
            }

            i{
                position: absolute;
                top: .5333rem;
                right: 0;
                font-size: 1.0667rem;
            }
        }

        .zhuyaolan{
            width: 9.4667rem;
            height: 2.0133rem;
            border: 0 solid black;
            display: flex;
            justify-content: space-between;
            margin: 0 auto;

            .box1,.box2,.box3{
                width: 2.6rem;
                height: 2.0133rem;
                border: 0 solid black;
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: flex-end;

                i{
                    font-size: 1.2rem;
                    color: white;
                }

                p{
                    font-size: .3467rem;
                    line-height: .6133rem;
                }
            }

            .box1{
                background-color: #b2e0a0;
   
            }

            .box2{
                background-color: #a0dce0;
            }

            .box3{
                background-color: #e0b7a0;
            }
        }

        .nav{

            margin-bottom: .2rem;

            .box1{
                margin-top: .4rem;

                p{
                    margin-left: .2rem;
                    font-size: .3467rem;
                    font-weight: normal;
                }

                i{
                    font-size: .9333rem;
                    margin-left: -0.1333rem;
                }


            } 

            .box2{
                margin-bottom: -0.3733rem;

                p{
                    font-size: .32rem;
                    font-weight: normal;
                }
            }

            .lvse{
                position: relative;
                i{
                    color: #b2e0a0;

                    &:last-of-type{
                        font-size: .5333rem;
                        position: absolute;
                        left: -0.16rem;
                        top: .1333rem;
                        color: rgb(204, 194, 194);
                    }
                }
            }

            .lanse{
                i{
                    color: #a0dce0;

                   
                }
            }

          
        }

        .nav2{
            margin-top: .4667rem;
        }

        .anniu{
            width: 6.9333rem;
            margin: 0 auto;
            display: flex;
            justify-content: space-between;

            button{
                width: 1.96rem;
                height: 1.0133rem;
                border-radius: .4rem;
                background-color: #ff9344;
                color: #fff;
                border: none;
                font-size: .32rem;
            }
        }
    }
}